import React, { Component } from 'react';
import '../../styles/My.scss'
import '../../assets/font_3864106_x4snsw96acr/iconfont.css'
import pic from '../../assets/1.jpg'
import { withRouter } from 'react-router-dom';
import *as service from '../../api/api'
class My extends Component {
    constructor(props){
        super(props)
        this.state ={
            ssindex:0,
            fanslist:0,
            pcmmlist:0,
            header_info: [
                {  name: '粉丝' },
                {  name: '好评' },
            ],
            centent_list:[
                {pic:'icon-yiyaoxiang',name:'我的收入'},
                {pic:'icon-yibao',name:'我的账户'},
                {pic:'icon-zu',name:'我的处方'},
            ],
            centent_lists:[
                {pic:'icon-huanzheguanli',name:'服务设置'},
                {pic:'icon-xiaoxi1',name:'消息提醒'},
                {pic:'icon-shouye',name:'意见反馈'},
            ]
        }
    }
    fansClick(){
        this.props.history.push('/fans')
    }
    pcmmClick(){
        this.props.history.push('/pcmm')
    }
    async componentDidMount(){
        var res = await service.fanslist({})
        console.log(res);
        this.setState({fanslist:res.data.length})
        var res2 = await service.pcmmlist({})
        console.log(res2);
        this.setState({pcmmlist:res2.data.length})
    }
    setupClick(){
        this.props.history.push('/setup')
    }
    render() {
        return (
            <div className='my'>
                <div className="header">
                    <div className="top">
                        <p>我的</p>
                        <p onClick={()=>{this.setupClick()}}><span className="iconfont">&#xe6f4;</span></p>
                    </div>
                    <div className="main">
                        <div className="m_left">
                            <img src={pic} alt="" />
                        </div>
                        <div className="m_center">
                            <div className="infomian">
                                <div className="shang">
                                    <span className='sps'>张三</span>
                                    <span className='sps'>主任医师</span>
                                    <span className='sps'>内科</span>
                                </div>
                                <div className="xia">
                                    <span className='spss'>北京协和医院</span>
                                </div>
                            </div>
                            <div className="right">
                                <span className="iconfont">&#xe65f;</span>
                            </div>
                        </div>
                    </div>
                </div>
                <div className="centent">
                     <div className="info">
                         <div onClick={()=>{this.fansClick()}} className="info_box">
                             <span>{this.state.fanslist}</span>
                             <p>粉丝</p>
                         </div>
                         <div onClick={()=>{this.pcmmClick()}} className="info_box">
                             <span>{this.state.pcmmlist}</span>
                             <p>好评</p>
                         </div>
                    </div>
                    <div className="lists">
                        {
                            this.state.centent_list.map((item,index)=>{
                                return (
                                    <div className="list_info" key={index}>
                                        <div className="info_left">
                                            <span className={"iconfont " + item.pic }></span>
                                            <p>{item.name}</p>
                                        </div>
                                        <div className="info-right">
                                            <p>&gt;</p>
                                        </div>
                                    </div>
                                )
                            })
                        }
                    </div>
                    <div className="listss">
                        {
                            this.state.centent_lists.map((item,index)=>{
                                return (
                                    <div className="list_info" key={index}>
                                        <div className="info_left">
                                            <span className={"iconfont " + item.pic }></span>
                                            <p>{item.name}</p>
                                        </div>
                                        <div className="info-right">
                                            <p>&gt;</p>
                                        </div>
                                    </div>
                                )
                            })
                        }
                    </div>
                </div>
               
            </div>
        );
    }
}

export default withRouter(My);